<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <!-- 避免IE使用兼容模式 -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
    <meta name="renderer" content="webkit">
    <!-- TopJUI框架样式 -->
    <link type="text/css" href="/topjui/css/topjui.core.min.css" rel="stylesheet">
    <link type="text/css" href="/topjui/themes/default/topjui.bluelight.css" rel="stylesheet" id="dynamicTheme"/>
    <!-- FontAwesome字体图标 -->
    <link type="text/css" href="/static/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet"/>
    <!-- layui框架样式 -->
    <link type="text/css" href="/static/plugins/layui/css/layui.css" rel="stylesheet"/>
    <link type="text/css" href="/static/public/css/font.css" rel="stylesheet"/>
    <link type="text/css" href="/static/public/css/main.css" rel="stylesheet"/>
    <!-- jQuery相关引用 -->
    <script type="text/javascript" src="/static/plugins/jquery/jquery.min.js"></script>

    <!--<script type="text/javascript" src="/js/tree/tree.js"></script>-->
    <!-- jQuery相关引用 -->
    <script type="text/javascript" src="/static/plugins/jquery/jquery.cookie.js"></script>
    <!-- TopJUI框架配置 -->
    <script type="text/javascript" src="/static/public/js/topjui.config.js"></script>
    <!-- TopJUI框架核心 -->
    <script type="text/javascript" src="/topjui/js/topjui.core.js"></script>
    <script type="text/javascript" src="/topjui/js/sysutils.js"></script>
    <!-- TopJUI中文支持 -->
    <script type="text/javascript" src="/topjui/js/locale/topjui.lang.zh_CN.js"></script>
    <!-- 首页js -->
    <script type="text/javascript" src="/static/public/js/topjui.index.js" charset="utf-8"></script>
    <script type="text/javascript" src="/static/plugins/layui/layui.all.js" charset="utf-8"></script>
    <style>
        body {
            font: 12px/normal "microsoft yahei", "Times New Roman", "宋体", Times, serif;
            margin: 5px;
        }

        blockquote p {
            padding: 5px;
        }

        .layui-table {
            margin-top: 0 !important;
        }

        .layui-elem-quote {
            margin-bottom: 0 !important;
        }

        .layui-table {
            margin-top: 0;
            border-left: 5px solid #e2e2e2 !important;
        }

        .layui-table td, .layui-table th {
            font-size: 12px;
        }

        .title .icon-new1 {
            margin-left: 10px;
            color: #f00;
        }
    </style>
</head>

<body>
<div style="display: block;height: 800px;overflow-y: hidden">
<div class="layui-container-fluid">
    <div class="panel_box row">
        <div class="panel col">
            <a href="javascript:;" data-url="page/message/message.html">
                <div class="panel_icon">
                    <i class="layui-icon icon-icon" data-icon="icon-icon"></i>
                </div>
                <div class="panel_word userAll">
                    <span id="newContractCount">-</span>
                    <cite>20年合同数</cite>
                </div>
            </a>
        </div>
        <div class="panel col">
            <a href="javascript:;" data-url="page/user/allUsers.html">
                <div class="panel_icon" style="background-color:#3447ff;">
                    <i class="layui-icon icon-star" data-icon="icon-star"></i>

                </div>
                <div class="panel_word userAll">
                    <span id="allCountractCount">-</span>
                    <cite>合同总数</cite>
                </div>
            </a>
        </div>
        <div class="panel col">
            <a href="javascript:;" data-url="page/user/allUsers.html">
                <div class="panel_icon" style="background-color:#5FB878;">
                    <i class="iconfont icon-dongtaifensishu" data-icon="icon-dongtaifensishu"></i>
                </div>
                <div class="panel_word userAll">
                    <span id="newCustomerCount"></span>
                    <cite>20年客户数</cite>
                </div>
            </a>
        </div>
        <div class="panel col">
            <a href="javascript:;" data-url="page/img/images.html">
                <div class="panel_icon" style="background-color:#009688;">
                    <i class="layui-icon" data-icon=""></i>
                </div>
                <div class="panel_word imgAll">
                    <span id="allCustomerCount"></span>
                    <cite>客户总数</cite>
                </div>
            </a>
        </div>
        <div class="panel col">
            <a href="javascript:;" data-url="page/news/newsList.html">
                <div class="panel_icon" style="background-color:#F7B824;">
                    <i class="layui-icon icon-rmb" data-icon="icon-rmb"></i>
                </div>
                <div class="panel_word waitNews">
                    <span id="receiveValue"></span>
                    <cite>收款总金额</cite>
                </div>
            </a>
        </div>
        <div class="panel col">
            <a href="javascript:;" data-url="page/news/newsList.html">
                <div class="panel_icon" style="background-color:#f76324;">
                    <i class="layui-icon icon-rmb" data-icon="icon-rmb"></i>
                </div>
                <div class="panel_word waitNews">
                    <span id="totalValue"></span>
                    <cite>合同总金额</cite>
                </div>
            </a>
        </div>
    </div>

    <div class="layui-row layui-col-space10">
        <div class="layui-col-md4">
            <blockquote class="layui-elem-quote title">最新收款信息<i class="iconfont icon-new1"></i></blockquote>
            <table class="layui-table" lay-skin="line">
                <colgroup>
                    <col>
                    <col width="110">
                </colgroup>
                <tbody class="hot_news" id="homePayment">
                </tbody>
            </table>
        </div>
        <div class="layui-col-md4">
            <blockquote class="layui-elem-quote title">最新中标信息<i class="iconfont icon-new1"></i></blockquote>
            <table class="layui-table" lay-skin="line">
                <colgroup>
                    <col>
                    <col width="110">
                </colgroup>
                <tbody class="hot_news" id="homeContract">
                </tbody>
            </table>
        </div>
        <div class="layui-col-md4">
            <blockquote class="layui-elem-quote title">最新客户信息</blockquote>
            <table class="layui-table" lay-skin="line">
                <colgroup>
                    <col>
                    <col width="110">
                </colgroup>
                <tbody class="hot_news" id="homeCustomer">
                </tbody>
            </table>
        </div>
    </div>

    <div class="layui-row layui-col-space10" style="height: 200px">
        <div class="layui-col-md4">
            <blockquote class="layui-elem-quote title">月销售量</blockquote>
            <table class="layui-table" lay-skin="line">
                <tbody>
                <tr>
                    <td>
<!--                        <div data-toggle="topjui-echarts"-->
<!--                             data-options="id:'barChart',url:'/json/echarts/bar.json',height:400"></div>-->
                        <div data-toggle="topjui-echarts"
                             data-options="id:'barChart',url:'/page/pageBar',height:400"></div>
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
        <div class="layui-col-md4">
            <blockquote class="layui-elem-quote title">最近订单金额曲线</blockquote>
            <table class="layui-table" lay-skin="line">
                <tbody>
                <tr>
                    <td align="left">
<!--                        <div data-toggle="topjui-echarts"-->
<!--                             data-options="id:'lineChart',url:'/page/pageLine',height:400"></div>-->
                        <div data-toggle="topjui-echarts"
                             data-options="id:'lineChart',url:'/page/pageHtTotal',height:400"></div>
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
        <div class="layui-col-md4">
            <blockquote class="layui-elem-quote title">当年销售员销售比例</blockquote>
            <table class="layui-table" lay-skin="line">
                <tbody>
                <tr>
                    <td>
<!--                        <div data-toggle="topjui-echarts"-->
<!--                             data-options="id:'pieChart',url:'/json/echarts/pie.json',height:400"></div>-->
                        <div data-toggle="topjui-echarts"
                             data-options="id:'pieChart',url:'/page/pagePie',height:400"></div>
                    </td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>
</div>
<script type="text/javascript" src="/static/plugins/echarts/echarts.min.js"></script>
<script>
    $.ajax({
        url : '/contract/newCountractCount',
        dataType : 'json',
        success : function(r) {
            if (r.code=='200') {
                $('#newContractCount').html(r.result);
            }
        }
    });
    $.ajax({
        url : '/contract/allCountractCount',
        dataType : 'json',
        success : function(r) {
            if (r.code=='200') {
                $('#allCountractCount').html(r.result);
            }
        }
    });
    $.ajax({
        url : '/customer/newCustomerCount',
        dataType : 'json',
        success : function(r) {
            if (r.code=='200') {
                $('#newCustomerCount').html(r.result);
            }
        }
    });
    $.ajax({
        url : '/customer/allCustomerCount',
        dataType : 'json',
        success : function(r) {
            if (r.code=='200') {
                $('#allCustomerCount').html(r.result);
            }
        }
    });
    $.ajax({
        url : '/contract/getMoney',
        dataType : 'json',
        success : function(r) {
            if (r.code=='200') {
                $('#receiveValue').html(r.result.receiveValue);
                $('#totalValue').html(r.result.totalValue);
            }
        }
    });

    $.ajax({
        url : '/home/getTopPayment',
        dataType : 'json',
        success : function(r) {
            if (r.code=='200') {
                var hl = "";
                for(rr of r.result){
                    hl += "<tr title='"+rr.ctname+"'><td align='left'><a href='#'>";
                    hl += rr.ctcode;
                    hl += "</a></td>";
                    hl += "<td align='right' width='100px'>￥"+rr.receive+"元</td>";
                    hl += "<td align='right'>"+rr.crtime+"</td>";
                    hl += "</tr>";
                }
                $('#homePayment').html(hl);
            }
        }
    });

    $.ajax({
        url : '/home/getTopContract',
        dataType : 'json',
        success : function(r) {
            if (r.code=='200') {
                var hl = "";
                for(rr of r.result){
                    hl += "<tr title='"+rr.code+"'><td align='left'><a href='#'>";
                    hl += rr.name;
                    hl += "</a></td>";
                    hl += "<td align='right' width='120px'>"+rr.crtime+"</td>";
                    hl += "</tr>";
                }
                $('#homeContract').html(hl);
            }
        }
    });

    $.ajax({
        url : '/home/getTopCustomer',
        dataType : 'json',
        success : function(r) {
            if (r.code=='200') {
                var hl = "";
                for(rr of r.result){
                    hl += "<tr title='"+rr.compname+"'><td align='left'><a href='#'>";
                    hl += rr.compname;
                    hl += "</a></td>";
                    hl += "</tr>";
                }
                $('#homeCustomer').html(hl);
            }
        }
    });
</script>
</body>
</html>